<template>
  <div class="settings-buttons">
    <BaseButton
        variant="primary"
        size="large"
        @click="redirectToChangePassword"
    >
      更改密码
    </BaseButton>
  </div>
</template>

<script setup>
import { useRouter } from 'vue-router'
import BaseButton from '@/components/BaseButton.vue'

const router = useRouter()

// 点击按钮时跳转到 changePassword 页面
const redirectToChangePassword = () => {
  router.push({ name: 'ChangePassword' })
}
</script>

<style scoped>
.settings-buttons {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1em;
  height: 100vh;
  width: 200px;
  margin: 0 auto;
}

.full-width {
  width: 100%;
}
</style>
